<template>
    <div class="content-drawer">
        <!-- v-if="type === 'cart'" -->
        <!-- 侧面选品 -->
        <div class="cart-con">
            <ul>
                <li v-for="(goods, goodsIndex) in cartList" :key="goodsIndex">
                    <div style="margin-right: 10px;">
                        <!-- <img :src="goods.goods.photo == null ? '' : goods.goods.photo.substring(0, 1) == 'h' ?
                            goods.goods.photo : `https://scm.gllscm.com${goods.photo}`" width="90" height="90" alt=""> -->
                        <img :src="goods.goods.photos[0] " width="90" height="90" alt="">
                    </div>

                    <div>
                        <p class="hover-color" @click="linkTo(`/goodsDetail?goods_id=${goods.goods_id}`)">
                            {{ goods.goodssku.goods_name }}
                        </p>
                        <p class="price">
                            {{ goods.goodssku.fx_price | unitPrice('￥') }}
                            <span>&nbsp;
                                x{{ goods.cartnum }}
                            </span>
                        </p>
                    </div>
                    <span class="del hover-color" @click="delGoods(goods.id)">删除</span>
                </li>
            </ul>
            <Button size="large" class="mt_10" type="primary" @click="linkTo('/cart')" long>提交选品</Button>
        </div>
        <Spin v-if="loading" fix></Spin>
    </div>
</template>

<script>
import {
    cartGoodsAll,
    delCartGoods,
    addCartGoods,
    cartCount
} from '@/api/cart.js'
import {
    getOrderList
} from '@/api/order';
import {
    couponList,
    receiveCoupon,
    tracksList,
    collectList,
    cancelCollect
} from '@/api/member.js'
export default {
    name: 'Drawer',
    props: {
        title: {
            default: '',
            type: String
        },
        type: {
            default: '',
            type: String
        }
    },
    watch: {
        type(val) {
            switch (val) {
                case 'cart':
                    this.getCartList()
                    break;
                case 'order':
                    this.getOrderList()
                    break;
                case 'track':
                    this.getTracksList()
                    break;
                case 'coupon':
                    this.getCouponList()
                    break;
                case 'collect':
                    this.getCollectList()
                    break;
            }
        }

    },
    data() {
        return {
            loading: false, // 控制spin显隐
            cartList: [], // 购物车列表
            couponList: [], // 优惠券列表
            orderList: [], // 订单列表
            collectList: [], // 收藏列表
            tracksList: [], // 足迹列表
            orderStatusList: [ // 订单状态
                {
                    name: '未付款',
                    status: 'UNPAID'
                },
                {
                    name: '已付款',
                    status: 'PAID'
                },
                {
                    name: '待发货',
                    status: 'UNDELIVERED'
                },
                {
                    name: '已发货',
                    status: 'DELIVERED'
                },
                {
                    name: '已完成',
                    status: 'COMPLETED'
                },
                {
                    name: '待核验',
                    status: 'TAKE'
                },
                {
                    name: '已取消',
                    status: 'CANCELLED'
                }
            ]
        };
    },
    methods: {
        getCartList() { // 获取购物车列表
            cartGoodsAll().then(res => {
                this.loading = false
                if (res.code == 1 && res.data.items) {
                    this.cartList = res.data.items;

                    this.$store.commit('SET_CARTNUM', res.data.total)
                    this.Cookies.setItem('cartNum', res.data.total)
                }
            })
        },
        // 删除商品
        delGoods(id) {
            delCartGoods({
                id: id.toString()
            }).then((res) => {
                if (res.code == 1) {
                    this.$Message.success('删除成功');
                    this.getCartList();
                } else {
                    this.$Message.error(res.msg);
                }
            });
        },
        filterOrderStatus(status) { // 获取订单状态中文
            const ob = this.orderStatusList.filter(e => {
                return e.status === status
            });
            return ob[0].name
        },
        receive(item) { // 领取优惠券
            receiveCoupon(item.id).then(res => {
                if (res.success) {
                    this.$Modal.confirm({
                        title: '领取优惠券',
                        content: '<p>优惠券领取成功，可到我的优惠券页面查看</p>',
                        okText: '我的优惠券',
                        cancelText: '立即使用',
                        onOk: () => {
                            this.$router.push('/home/Coupons')
                        },
                        onCancel: () => {
                            if (item.storeId !== '0') {
                                this.$router.push({
                                    path: '/merchant',
                                    query: {
                                        id: item.storeId
                                    }
                                })
                            } else {
                                if (item.scopeType === 'PORTION_GOODS_CATEGORY') {
                                    this.$router.push({
                                        path: '/goodsList',
                                        query: {
                                            categoryId: item.scopeId
                                        }
                                    })
                                } else {
                                    this.$router.push({
                                        path: '/goodsList'
                                    })
                                }
                            }
                        }
                    });
                }
            })
        },
        useScope(type, storeName) { // 判断优惠券使用范围
            let shop = '平台';
            let goods = '全部商品'
            if (storeName !== 'platform') shop = storeName
            switch (type) {
                case 'ALL':
                    goods = '全部商品'
                    break;
                case 'PORTION_GOODS':
                    goods = '部分商品'
                    break;
                case 'PORTION_GOODS_CATEGORY':
                    goods = '部分分类商品'
                    break;
            }
            return `${shop}${goods}可用`
        },
        addToCart(id) { // 添加商品到购物车
            const params = {
                num: 1,
                skuId: id
            }
            this.loading = true;
            addCartGoods(params).then(res => {
                this.loading = false;
                if (res.success) {
                    this.$Message.success('商品已成功添加到购物车')
                } else {
                    this.$Message.warning(res.message);
                }
            }).catch(() => {
                this.loading = false
            });
        },
        getCouponList() { // 获取优惠券列表
            // this.loading = true;
            const params = {
                pageNumber: 1,
                pageSize: 10
            }
            couponList(params).then(res => {
                this.loading = false
                if (res.success) {
                    this.couponList = res.result.records
                }
            }).catch(() => {
                this.loading = false
            })
        },
        getOrderList() { // 获取订单列表
            this.loading = true
            const params = {
                pageNumber: 1,
                pageSize: 10,
                tag: 'ALL'
            }
            getOrderList(params).then(res => {
                this.loading = false
                if (res.success) {
                    this.orderList = res.result.records;
                }
            });
        },
        getCollectList() { // 获取收藏列表
            const params = {
                pageNumber: 1,
                pageSize: 10,
                type: 'GOODS'
            }
            this.loading = true
            collectList(params).then(res => {
                this.loading = false
                this.collectList = res.result.records
            })
        },
        cancelCollect(id) { // 取消商品收藏
            cancelCollect('GOODS', id).then(res => {
                if (res.success) {
                    this.$Message.success('取消收藏成功')
                    this.getCollectList();
                }
            })
        },
        getTracksList() { // 获取足迹列表
            const params = {
                pageNumber: 1,
                pageSize: 20
            }
            this.loading = true
            tracksList(params).then(res => {
                this.tracksList = res.result.records
                this.loading = false
            }).catch(() => {
                this.loading = false
            })
        }
    }
};
</script>

<style scoped lang="scss">
@import '../../assets/styles/coupon.scss';
@import './drawer.scss';

.coupon-item {
    overflow: hidden;
    background-color: #fff;
    height: 120px;

    .c-left {
        padding: 15px;
    }

    .c-right {
        width: 38px;
        padding: 13px;
        font-size: 14px;
    }

    i {
        right: 30px;
        background-color: #eee;
    }
}
</style>
